<!-- /*
*   @Description:预约探视
*   @Author:lxy
*   @Date:2023-03-23 10:23
*/ -->
<template>
    <div class="familyInformation_box">
      <searchFrom ref="searchFrom" @forSubmit="forSubmit"></searchFrom>
      <br />
       <!-- 表格组件 -->
       <tableTemplate v-bind="tableConfigObject" class="CHAGE_SCROLLBAR productService_table">
        <template slot="btnSlotName" slot-scope="{ item }">
          <el-button type="text" @click="($event) => buttonClickFunction(item, '查看')">查看</el-button>
          <el-button type="text" @click="($event) => buttonClickFunction(item, '编辑')" v-show="!item.gsdhp">前去审核</el-button>
          <el-button type="text" @click="($event) => buttonClickFunction(item, '删除')">删除</el-button>
        </template>
      </tableTemplate>
      <!-- 分页组件 -->
      <paginationTemplate
      style="margin: 10px 0px 100px 0px;"
        v-bind="paginationObject" 
        @currentChangeFunction="currentChangeFunction"
      ></paginationTemplate>
  
      <!-- 弹出框测试 -->
      <taskInFoDialog ref="taskInFoDialogRef" @taskFoDialo="taskFoDialo"></taskInFoDialog>
    </div>
  </template>
  
  <script>
  import {setrYuyueMessage,delYuyueMessage} from '@/api/pageMessage'
  import searchFrom from "@/views/InformationManagement/appointmentVisits/components/searchFrom.vue";
  import taskInFoDialog from "@/views/InformationManagement/appointmentVisits/components/taskInFoDialog.vue";
  import tableTemplate from "@/components/TableTemplate.vue";
  import paginationTemplate from "@/components/PaginationTemplate.vue";
  import { fromConfig } from "./config/config";
  export default {
    name: "appointmentVisits",
    components: {
      searchFrom,
      tableTemplate,
      paginationTemplate,
      taskInFoDialog
    },
    data() {
      return {
        tableConfigObject: {
          //表头数据
          elTableListData: [],
          // 表头行配置
          elTableListConfig: fromConfig,
          
        },
        // 分页组件使用的数据
        paginationObject: {
          layout: "prev , pager, next, jumper",
          pageSize: 8,
          pageSizes: [10, 20, 30, 40],
          currentPage: 1,
          total: 0,
        },
      };
    },
    methods:{
      buttonClickFunction(itVal, type) {
        if(type == "编辑" || type == "查看"){
          this.$refs.taskInFoDialogRef?.handleOpen(itVal,type);
        }else if(type == '删除'){
          this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.delFamilyMessageFunction(itVal)
          }).catch(()=>{});
        }
      },
      currentChangeFunction(val) {
        this.paginationObject.currentPage = val
        this.getWebData()
      },
      //获取数据
      getWebData(){
        let parmrs = {
          ...this.$refs.searchFrom.getSearchForm(),
          pageSize:this.paginationObject.pageSize,
          currentPage:this.paginationObject.currentPage,
          //查询姓名
          //查询性别
          //一页显示多少条数据
          //目前处于第几页
        }


        console.log("查询的参数",parmrs)
        setrYuyueMessage(parmrs).then(res=>{
            console.log("res",res)
          this.tableConfigObject.elTableListData = res.data.data
          this.paginationObject.total = res.data.totalpage
        })
      },
      //点击了查询
      forSubmit(){
        this.paginationObject.currentPage = 1
        this.getWebData()
      },
      //点击删除
      delFamilyMessageFunction(val){
        delYuyueMessage(val).then(res=>{
            this.$notify({title: '提示',message:'删除成功',type: 'success'});
          this.getWebData()
        })
      },
      //编辑完成后刷新和数据
      taskFoDialo(){
        this.getWebData()
      }
    },
    mounted(){
      this.getWebData()
    }
  };
  </script>
  
  <style scoped lang="less">
  .familyInformation_box{
    box-sizing: border-box;
    background-color: #ffffff;
    padding: 16px 30px;
  }
  .productService_table{
    height: 500px;
  }
  </style>
  